<template>
  <div>
    <micro-app name="calculator" :url="url" router-mode='native-scope' :data="microAppData" @created="handleCreate" @beforemount="handleBeforeMount" @mounted="handleMount" @unmount="handleUnmount" @error="handleError" @datachange="handleDataChange" />
  </div>
</template>

<script>
export default {
  name: 'Appvue',
  data () {
    return {
      // url: window._CONFIG.pricecalculator,
      url: 'http://localhost:4001/test/',
      // url: `http://10.104.125.25:18712/`,
      microAppData: { name: 'calculator' }
    }
  },
  mounted () {
    // debugger
  },
  methods: {
    handleCreate () {
      // this.url = window.location.protocol + "//" + window.location.host + "/pricecal"
      this.url = 'http://localhost:4001/test/'
      console.log('child-vue2 创建了')
    },

    handleBeforeMount () {
      console.log('child-vue2 即将被渲染')
    },

    handleMount () {
      console.log('child-vue2 已经渲染完成')

      setTimeout(() => {
        this.microAppData = { name: 'calculator' }
      }, 100)
    },

    handleUnmount () {
      console.log('child-vue2 卸载了')
    },

    handleError () {
      console.log('child-vue2 加载出错了')
    },

    handleDataChange (e) {
      console.log('来自子应用 child-vue2 的数据:', e.detail.data)
    }
  }
}
</script>

<style></style>
